<template>
  <div id="user-info">
    <div class="detail">
        <p class="item">姓名：{{userDetail.userName}}</p>
        <p class="item">电话：{{userDetail.telephone}}</p>
        <p class="item">账号：{{userDetail.loginName}}</p>
        <p class="item">邮箱：{{userDetail.email}}</p>
        <p class="item">角色：{{userDetail.roleNames}}</p>
        <p class="item">状态：{{userDetail.statusName}}</p>
        <p class="item">部门：{{userDetail.deptName}}</p>
        <p class="item">区域：{{userDetail.areaName}}</p>
        <p class="item">备注：{{userDetail.remark}}</p>
        <p class="item">创建时间：{{userDetail.createDate}}</p>
        <p class="item">更新时间：{{userDetail.updateDate}}</p>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      userDetail: {
        userName: "",
        areaName: "",
        deptName: "",
        remark: "",
        statusName: "",
        loginName: "",
        roleIds: "",
        roleNames:'',
        createDate: "",
        telephone: "",
        updateDate: "",
        email: ""
      },
      showDialog: false
    };
  },
  computed:{
      //用户状态
      userStatusList(){
          var statusList=JSON.parse(localStorage.getItem('statusList'))
          return statusList.userStatus
      },
  },
  methods: {
    getUserDetail() {
      let id = {
        id:this.$store.state.user.id
      }
      // let fromDta = new FormData()
      // for(let key in id){
      //   fromDta.append(key,id[key])
      // }
      this.$http.getUserDetail(id)
      .then(res => {
          var data=res.data.data
          if(!data){return}
          var newData=this.transData(data)
          this.userDetail = newData
        }).catch(err => {
          throw(err)
        });
    },
    //数据转换
    transData(data){
      if(!data){return}
      var roleNames=data.roleIds.split(",").map((item)=>{
          return item.split(":")[1]
      }).join()
      data.roleNames=roleNames
      for(var key in this.userStatusList){
          if(data.status===this.userStatusList[key]){
              data.statusName=key
          }
      }
      return data
    }


  },
  created() {
    this.getUserDetail();
  }
};
</script>
<style scoped lang="scss">
#user-info{
  height:100%;

}

.detail{
  display:flex;
  flex-wrap:wrap;
  color: #d7e5f7;
  .item{
    flex:40%;
    margin:10px;
  }
}

</style>



